<template>
    <div class="app-container">
        <div class="customContainer ">
            <!-- 搜索头 -->

            <el-form :model="formInline" :inline="true" size="small">
                <el-form-item>
                    <el-select filterable placeholder="选择门店" v-model="formInline.store_id">
                        <el-option v-for="item in storeList" :key="item.id" :label="item.name" :value="item.id">
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item>
                    <el-select  v-model="formInline.is_effective" filterable style="width:100px">
                        <el-option v-for="item in effective_list" :key="item.id" :label="item.name" :value="item.id">
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item>
                    <el-select placeholder="选择关联状态" v-model="formInline.is_related" filterable>
                        <el-option v-for="item in type_list" :key="item.id" :label="item.name" :value="item.id">
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item>
                    <el-input placeholder="请输入名称" v-model="formInline.name" class="w200"></el-input>
                </el-form-item>
                <el-form-item>
                    <dj-button size="small" @search="searchClick" />
                </el-form-item>
                <el-button class="pull-right" type="primary" size="small" @click="addEditClick()">添加套餐</el-button>
            </el-form>

            <!-- 表格 -->
            <el-table highlight-current-row :data="list" v-loading.body="listLoading" border size="mini">
                <el-table-column align="center" label='序号' width="50">
                    <template slot-scope="scope">
                        <span class="indexColor">{{scope.$index+1+(currentPage-1)*20}}</span>
                    </template>
                </el-table-column>
                <el-table-column align="center" label='套餐名称' prop="name">
                    <template slot-scope="scope">
                        <el-button type="text" @click="addEditClick(scope.row.id,scope.$index,'look')">
                            {{scope.row.name}}</el-button>
                    </template>
                </el-table-column>
                <el-table-column align="center" label='生效时间'>
                    <template slot-scope="scope">
                        {{scope.row.effect_time}}--{{scope.row.stop_time}}
                    </template>
                </el-table-column>
                <el-table-column align="center" label="适用门店">
                    <template slot-scope="scope">
                        {{ scope.row.store_list[0]?scope.row.store_list[0].name:'无'}}
                        {{ scope.row.store_list[1]?'，'+scope.row.store_list[1].name:''}}
                        {{ scope.row.store_list[2]?'，'+scope.row.store_list[2].name+'...':''}}
                    </template>
                </el-table-column>
                <el-table-column align="center" label='操作'>
                    <template slot-scope="scope">
                        <el-button @click="addEditClick(scope.row.id,scope.$index)" type="primary" icon="el-icon-edit"
                            size="mini"></el-button>
                        <el-button type="danger" icon="el-icon-delete" size="mini"
                            @click="delActivityClick(scope.row.id,scope.$index)"></el-button>
                        <el-button type="primary" plain size="mini" @click="deployStoreClick(scope.row.id)">配置门店
                        </el-button>
                    </template>
                </el-table-column>
            </el-table>
            <!-- 套餐新增编辑弹框 -->
            <el-dialog style="margin-top:-5vh" :close-on-click-modal="false" width="730px"
                :title="isDisabled?'套餐详情':'新增套餐'" :visible.sync="addEditDialog" @close="callOf('saveForm')">
                <el-form :model="saveForm" size="small" ref="saveForm" :rules="rules" :key="saveForm.is_re"
                    :inline="true">
                    <!-- <el-form-item label="关联第三方卡券" v-if="isDisabled && saveForm.is_related == 1">
                        <el-popover placement="top-start" title="卡券详情" width="400" trigger="click">
                            <p>卡券名称：{{product_info.name}}</p>
                            <p>卡券金额：{{product_info.money}}</p>
                            <p>&#x3000;卡券码：{{product_info.id}}</p>
                            <p>使用规则：{{product_info.use_rules}}</p>
                            <p>&#x3000;有效期：{{product_info.effect_time}} - {{product_info.stop_time}}</p>
                            <p class="text_overflow">适用门店：<span v-for="(item,index) in product_info.store_list"
                                    :key="index">{{item}}、</span></p>
                            <p>卡券说明：{{product_info.remark}}</p>
                            <el-button slot="reference" type="text" @click="getProduct(saveForm.product_id)">商品ID：
                                {{saveForm.product_id}}</el-button>
                        </el-popover>
                    </el-form-item>
                    <el-form-item v-if="!isDisabled">
                        <el-checkbox true-label="1" false-label="0" style="margin-left:10px"
                            v-model="saveForm.is_related" @change="relatedChange">关联第三方卡券</el-checkbox>
                    </el-form-item>
                    <el-form-item label="支付宝口碑" prop="product_id" v-if="saveForm.is_related == 1 && !isDisabled">
                        <el-input type="number" placeholder="输入商品ID" v-model="saveForm.product_id" style="width:570px;">
                        </el-input>
                    </el-form-item> -->
                    <el-form-item style="display: inline-block">
                        <el-checkbox :disabled="isDisabled" v-model="saveForm.is_re" @change="relatedChange">关联第三方商品
                        </el-checkbox>
                    </el-form-item>
                    <el-form-item v-if="saveForm.is_re" prop="is_collect" style="width:125px; display: inline-block">
                        <el-select :disabled="isDisabled" size="mini" filterable v-model="saveForm.is_collect">
                            <el-option v-for="item in related_list" :key="item.id" :label="item.name" :value="item.id">
                            </el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item v-if="saveForm.is_re&&saveForm.is_collect*1<3" prop="product_id"
                        style="width:125px; display: inline-block">
                        <el-input :disabled="isDisabled" size="mini" placeholder="输入商品ID" v-model="saveForm.product_id">
                        </el-input>
                    </el-form-item>
                    <el-form-item label="　套餐名称" prop="name">
                        <el-input :disabled="isLook" placeholder="请输入套餐名称" v-model="saveForm.name" style="width:570px;">
                        </el-input>
                    </el-form-item>
                    <el-form-item label="　套餐说明" prop="remark">
                        <el-input :disabled="isLook" type="textarea" placeholder="请输入套餐说明" v-model="saveForm.remark"
                            style="width:570px;"></el-input>
                    </el-form-item>
                    <div style='background-color:#eee;height:1px;border:none;'></div>
                    <br>
                    <el-form-item label="　兑换凭证" prop="exchange_voucher">
                        <el-input :disabled="isLook" placeholder="请输入兑换凭证" v-model="saveForm.exchange_voucher"
                            style="width:358px;"></el-input>
                    </el-form-item>
                    <el-form-item label="应收金额" prop="money">
                        <el-input min="0" :disabled="isDisabled" type="number" onmousewheel="return false;"
                            v-model="saveForm.money" style="width:120px;"></el-input>
                    </el-form-item>
                    <el-form-item label="　适用类型" prop="type_id">
                        <el-select :disabled="isDisabled" v-model="saveForm.type_id" placeholder="用户类型"
                            style="width:120px;" @change="typeChange()">
                            <el-option v-for="item in typeIdList" :key="item.id" :label="item.name" :value="item.id">
                            </el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item prop="card_type_id">
                        <el-select :disabled="isDisabled" v-model="saveForm.card_type_id" multiple placeholder="细分类型"
                            style="width:440px;">
                            <el-option v-for="item in card_type_idList" :key="item.id" :label="item.name"
                                :value="item.id">
                            </el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="·　 套餐类型">
                        <span>{{saveForm.type=='0'?'售币类套餐':saveForm.type=='1' ?'门禁类套餐':'--' }}</span>
                        <!-- <el-select disabled v-model="saveForm.type" placeholder="套餐类型">
                            <el-option v-for="item in typeList" :key="item.id" :label="item.name" :value="item.id">
                            </el-option>
                        </el-select> -->
                    </el-form-item>
                    <br>
                    <el-form-item v-if="saveForm.type_id==0" label="　赠送币数" prop="add_coins">
                        <el-input min="0" :disabled="isDisabled" type="number" onmousewheel="return false;"
                            v-model="saveForm.add_coins" style="width:120px;"></el-input>
                    </el-form-item>
                    <el-form-item v-if="saveForm.type_id==0" min="0" label="　赠送积分" prop="add_score">
                        <el-input :disabled="isDisabled" type="number" onmousewheel="return false;"
                            v-model="saveForm.add_score" style="width:120px;"></el-input>
                    </el-form-item>
                    <el-form-item v-if="saveForm.type_id==0" min="0" label="　赠送票数" prop="add_ticket">
                        <el-input :disabled="isDisabled" type="number" onmousewheel="return false;"
                            v-model="saveForm.add_ticket" style="width:120px;"></el-input>
                    </el-form-item>
                    <el-form-item v-if="saveForm.type_id==1||saveForm.type_id==''" label="　赠送次数" prop="add_time">
                        <el-input :disabled="isDisabled" type="number" onmousewheel="return false;"
                            v-model="saveForm.add_time" style="width:120px;"></el-input>
                    </el-form-item>
                    <div style='background-color:#eee;height:1px;border:none;'></div>
                    <br>
                    <!-- <el-checkbox v-if="saveForm.is_related != 1" :disabled="isDisabled" true-label="1" false-label="0"
                        style="margin-left:25px;" v-model="saveForm.is_collect" label="代收待核" border></el-checkbox> -->
                    <el-form-item label="　生效日期" prop="pickerDate">
                        <el-date-picker :disabled="isDisabled" v-model="saveForm.pickerDate" value-format="yyyy-MM-dd"
                            type="daterange" align="right" unlink-panels range-separator="-" start-placeholder="开始日期"
                            end-placeholder="结束日期" :picker-options="pickerOptions"></el-date-picker>
                    </el-form-item>
                    <br>
                    <el-form-item label="　适用卡类" prop="card_use_type">
                        <el-select :disabled="isLook" v-model="saveForm.card_use_type" style="width:100px;">
                            <el-option v-for="item in use_card_list" :key="item.id" :label="item.name"
                                :value="item.id">
                            </el-option>
                        </el-select>                        
                    </el-form-item>
                    <br>
                    <div class="check_item">
                        <el-checkbox @change="checkChange(isUsed1,'use_time')" :disabled="isLook" style="margin: 8px 33px 24px 0;" v-model="isUsed1">单卡单笔使用上限</el-checkbox>
                        <el-form-item class="check_form_item" v-if="isUsed1" prop="use_time">
                            <el-input :disabled="isLook" style="width:120px;" size="small" v-model.number="saveForm.use_time"
                                placeholder="输入次数"></el-input>
                        </el-form-item>
                        <div class="check_box">
                            <el-checkbox @change="checkChange(isUsed2,'card_day_use_times')" :disabled="isLook" style="margin: 8px 46px 24px 0;" v-model="isUsed2">单卡单日使用上限</el-checkbox>
                            <el-form-item class="check_form_item" v-if="isUsed2" prop="card_day_use_times">
                                <el-input :disabled="isLook" style="width:120px;" size="small" v-model.number="saveForm.card_day_use_times"
                                    placeholder="输入次数"></el-input>
                            </el-form-item>
                        </div>
                    </div>
                    <div class="check_item">
                        <el-checkbox @change="checkChange(isUsed3,'card_effect_use_times')" :disabled="isLook" style="margin: 8px 5px 24px 0;" v-model="isUsed3">单卡活动期间使用上限</el-checkbox>
                        <el-form-item class="check_form_item" v-if="isUsed3" prop="card_effect_use_times">
                            <el-input :disabled="isLook" style="width:120px;" size="small" v-model.number="saveForm.card_effect_use_times"
                                placeholder="输入次数"></el-input>
                        </el-form-item>
                        <div class="check_box">
                            <el-checkbox @change="checkChange(isUsed4,'store_effect_use_times')" :disabled="isLook" style="margin: 8px 5px 24px 0;" v-model="isUsed4">门店活动期间总使用上限</el-checkbox>
                            <el-form-item class="check_form_item" v-if="isUsed4" prop="store_effect_use_times">
                                <el-input :disabled="isLook" style="width:120px;" size="small" v-model.number="saveForm.store_effect_use_times"
                                    placeholder="输入次数"></el-input>
                            </el-form-item>
                        </div>
                    </div>
                    <div class="check_item">
                        <el-checkbox @change="checkChange(isUsed5,'store_day_use_times')" :disabled="isLook" style="margin: 8px 19px 24px 0;" v-model="isUsed5">门店单日总使用上限</el-checkbox>
                        <el-form-item class="check_form_item" v-if="isUsed5" prop="store_day_use_times">
                            <el-input :disabled="isLook" style="width:120px;" size="small" v-model.number="saveForm.store_day_use_times"
                                placeholder="输入次数"></el-input>
                        </el-form-item>
                    </div>
                </el-form>
                <div slot="footer" class="dialog-footer">
                    <el-button v-if="!isLook" type="primary" @click="saveClick('saveForm')" size="small">保存配置
                    </el-button>
                </div>
            </el-dialog>
            <!-- 配置门店弹框 -->
            <el-dialog :close-on-click-modal="false" width="650px" title="选择门店" :visible.sync="storeDialog">
                <div style="position: relative;top: -20px">{{storeDialogName}}
                    <el-tooltip class="item" effect="dark" placement="bottom-end">
                        <div slot="content">
                            {{storeDialogRemark}}
                        </div>
                        <i class="el-icon-question"></i>
                    </el-tooltip>
                </div>
                <div>
                    <div class="el-transfer-panel pull-left transferHeader">选择门店</div>
                    <div class="el-transfer-panel pull-right transferHeader">已选门店</div>
                </div>
                <el-transfer :props="{key: 'id', label: 'name'}" :titles="['全选', '全选']" :button-texts="['删除', '添加']"
                    filterable v-model="check_store_list" :data="t_store_list">
                </el-transfer>
                <span slot="footer" class="dialog-footer">
                    <el-button size="small" type="primary" @click="saveDeployStoreClick()">确 定</el-button>
                </span>
            </el-dialog>
        </div>
        <!-- 自定义底部 -->
        <div class="bottom_box">
            <el-pagination class="pull-left" background @current-change="handleCurrentChange"
                :current-page.sync="currentPage" :page-size="20" layout="prev, pager, next, jumper"
                :total="totalDataNumber">
            </el-pagination>
        </div>
    </div>
</template>

<script>
    import {
        getList,
        getPage,
        statePackage,
        getActivityInfo,
        addPackage,
        editPackage,
        delActivity,
        deployStore,
        save,
        getBrand,
        getStoreList,
        delStore,
        saveDeployStore,
        product,
    } from "@/api/member/activity";
    import { num0to99999, integer1to999999 } from '@/utils/validate'
    import { pickerOptionsAfterF } from '@/utils';
    export default {
        data() {
            const validateVal = (rule, value, callback) => {
                if (!num0to99999(value)) {
                    callback(new Error('请输入0-99999数字'))
                } else {
                    callback()
                }
            }
            const vUse1 = (rule, value, callback) => {
                if (this.isUsed1&&!integer1to999999(value)) {
                    callback(new Error('请输入1-999999整数'))
                } else {
                    callback()
                }
            }
            const vUse2 = (rule, value, callback) => {
                if (this.isUsed2&&!integer1to999999(value)) {
                    callback(new Error('请输入1-999999整数'))
                } else {
                    callback()
                }
            }
            const vUse3 = (rule, value, callback) => {
                if (this.isUsed3&&!integer1to999999(value)) {
                    callback(new Error('请输入1-999999整数'))
                } else {
                    callback()
                }
            }
            const vUse4 = (rule, value, callback) => {
                if (this.isUsed4&&!integer1to999999(value)) {
                    callback(new Error('请输入1-999999整数'))
                } else {
                    callback()
                }
            }
            const vUse5 = (rule, value, callback) => {
                if (this.isUsed5&&!integer1to999999(value)) {
                    callback(new Error('请输入1-999999整数'))
                } else {
                    callback()
                }
            }
            return {
                type_list: [{ id: '0', name: '未关联卡券代金券' }, { id: '1', name: '关联卡券代金券' }],
                effective_list: [{ id: '1', name: '有效套餐' }, { id: '0', name: '失效套餐' }],
                typeIdList: [{ id: '0', name: '会员卡' }, { id: '1', name: '次卡' }],
                use_card_list: [{ id: '0', name: '全部' }, { id: '1', name: '新办卡' }, { id: '2', name: '已办卡' }],
                related_list: [{ id: '1', name: '关联快盈 ' }, { id: '2', name: '关联口碑' }, { id: '3', name: '代收待核' }],
                card_type_idList: [],
                is_edit: false,
                list: null,
                isDisabled: true,
                isLook: false,
                listLoading: false,
                addEditDialog: false,
                storeDialog: false,
                storeDialogName: '',
                storeDialogRemark: '',
                check_store_list: [],
                storeList: [],
                t_store_list: [],
                editIndex: '',
                isUsed1: false,
                isUsed2: false,
                isUsed3: false,
                isUsed4: false,
                isUsed5: false,
                currentPage: 1,
                url: '',
                brandList: null,
                totalDataNumber: 1,
                formInline: {
                    is_related: '0',
                    is_effective: '1',
                    name: "",
                    store_id: ""
                },
                product_info: {},
                gradeList: [],
                saveStore: {
                    id: '',
                    store_list: []
                },
                saveForm: {
                    product_id: '',
                    id: '',
                    name: '',
                    remark: '',
                    exchange_voucher: '',
                    money: '',
                    type_id: '',
                    card_type_id: [],
                    add_coins: '',
                    add_score: '',
                    add_ticket: '',
                    add_time: '',
                    effect_time: '',
                    stop_time: '',
                    is_collect: '',
                    pickerDate: '',
                    is_re: '',
                    card_use_type:'0',
                    use_time: '',
                    card_day_use_times:'',
                    card_effect_use_times:'',
                    store_day_use_times:'',
                    store_effect_use_times:'',
                },
                rules: {
                    product_id: [
                        { required: true, message: '请输入商品ID', trigger: 'blur' },
                    ],
                    name: [
                        { required: true, message: '请输入套餐名称', trigger: 'blur' },
                    ],
                    card_type_id: [
                        { required: true, message: '请选择', trigger: 'change' },
                    ],
                    limit: [
                        { required: true, message: '请输入充值金额', trigger: 'blur' },
                    ],
                    remark: [
                        { required: true, message: '请输入套餐说明', trigger: 'blur' }
                    ],
                    exchange_voucher: [
                        { required: true, message: '请输入', trigger: 'blur' }
                    ],
                    money: [
                        { required: true, validator: validateVal, trigger: 'blur' }
                    ],
                    type_id: [
                        { required: true, message: '请选择', trigger: 'change' }
                    ],
                    add_coins: [
                        { required: true, validator: validateVal, trigger: 'blur' }
                    ],
                    add_score: [
                        { required: true, validator: validateVal, trigger: 'blur' }
                    ],
                    add_ticket: [
                        { required: true, validator: validateVal, trigger: 'blur' }
                    ],
                    add_time: [
                        { required: true, validator: validateVal, trigger: 'blur' }
                    ],
                    type: [
                        { required: true, message: ' ', trigger: 'change' }
                    ],
                    pickerDate: [
                        { required: true, message: '请选择日期', trigger: 'change' }
                    ],
                    grade: [
                        { required: true, message: '请选择适用等级', trigger: 'change' }
                    ],
                    card_use_type: [
                        { required: true, message: '请选择适用卡类', trigger: 'change' }
                    ],
                    use_time: [
                        { required: false, validator: vUse1, trigger: 'blur' }
                    ],
                    card_day_use_times: [
                        { required: false, validator: vUse2, trigger: 'blur' }
                    ],
                    card_effect_use_times: [
                        { required: false, validator: vUse3, trigger: 'blur' }
                    ],
                    store_effect_use_times: [
                        { required: false, validator: vUse4, trigger: 'blur' }
                    ],
                    store_day_use_times: [
                        { required: false, validator: vUse5, trigger: 'blur' }
                    ],
                },
                pickerDate: [],
                pickerOptions: pickerOptionsAfterF(),
            };
        },
        beforeRouteEnter(to, from, next) {
            next((vm) => {//当进入组件之前，执行 beforRouteEnter 路由钩子函数 ,//参数vm就是当前组件的实例。
                if (!vm.brandList) {
                    vm.getStore();
                }
            })
        },
        methods: {
            getProduct(id) {
                this.product_info = {};
                product({ product_id: id }).then(response => {
                    this.product_info = response;
                });
            },
            relatedChange() {
                this.saveForm.product_id = "";
            },
            checkChange(val,key){
                if(!val){
                    this.saveForm[key]="";
                }
            },
            // 保存门店
            saveDeployStoreClick() {
                //console.log(this.check_store_list)
                this.saveStore.store_list = this.check_store_list
                saveDeployStore(this.saveStore).then(response => {
                    this.$message({ type: response.code == 1 ? 'success' : 'error', message: response.message });
                    if (response.code == 1) {
                        this.storeDialog = false;
                        this.handleCurrentChange(this.currentPage)
                    }
                })
            },
            // 配置门店弹框
            deployStoreClick(id) {
                this.saveStore.id = id
                this.check_store_list = []
                deployStore({ id: id }).then(response => {
                    this.storeDialogName = response.name;
                    this.storeDialogRemark = response.remark;
                    response.list.forEach(val => {
                        this.check_store_list.push(val.store_id)
                    })
                    this.storeDialog = true;
                })
            },
            typeChange() {
                this.saveForm.card_type_id = [];
                this.card_type_idList = this.saveForm.type_id == 0 ? [{ id: '0', name: '普通会员卡' }, { id: '1', name: '精英会员卡' }, { id: '2', name: '临时卡' }] : [{ id: '6', name: '6次卡' }, { id: '10', name: '10次卡' }, { id: '12', name: '12次卡' }, { id: '20', name: '20次卡' }]
                if (this.saveForm.type_id == 1) {
                    this.saveForm.type = '1';
                    this.saveForm.add_coins = '';
                    this.saveForm.add_ticket = '';
                    this.saveForm.add_score = '';
                } else {
                    this.saveForm.type = '0';
                    this.saveForm.add_time = '';
                }
            },
            addEditClick(id, index, look) {
                this.isLook = look == 'look' ? true : false;
                this.isDisabled = id ? true : false
                this.addEditDialog = true;
                this.editIndex = id ? index : '';
                this.url = id ? '/Muma_giving_package/update_package' : '/Muma_giving_package/create_package';
                this.saveForm.id = id ? id : '';
                if (id) {
                    getActivityInfo({ id: id }).then(response => {
                        this.card_type_idList = response.type_id == 0 ? [{ id: '0', name: '普通会员卡' }, { id: '1', name: '精英会员卡' }, { id: '2', name: '临时卡' }] : [{ id: '6', name: '6次卡' }, { id: '10', name: '10次卡' }, { id: '12', name: '12次卡' }, { id: '20', name: '20次卡' }]
                        this.saveForm.name = response.name
                        this.saveForm.remark = response.remark
                        this.saveForm.exchange_voucher = response.exchange_voucher
                        this.saveForm.money = response.money
                        this.saveForm.type_id = response.type_id
                        this.saveForm.type = response.type
                        this.saveForm.card_type_id = response.card_type_id.split(',')
                        this.saveForm.add_coins = response.add_coins
                        this.saveForm.add_score = response.add_score
                        this.saveForm.add_ticket = response.add_ticket
                        this.saveForm.add_time = response.add_time
                        this.saveForm.effect_time = response.effect_time
                        this.saveForm.stop_time = response.stop_time
                        this.saveForm.is_collect = response.is_collect + ''
                        this.saveForm.product_id = response.product_id
                        this.saveForm.pickerDate = [response.effect_time, response.stop_time]
                        this.saveForm.card_use_type = response.card_use_type
                        this.saveForm.is_re = response.is_collect > 0 ? true : false;
                        this.isUsed1=response.use_time==0?false:true;
                        this.saveForm.use_time=response.use_time==0?"":response.use_time;
                        this.isUsed2=response.card_day_use_times==0?false:true;
                        this.saveForm.card_day_use_times=response.card_day_use_times==0?"":response.card_day_use_times;
                        this.isUsed3=response.card_effect_use_times==0?false:true;
                        this.saveForm.card_effect_use_times=response.card_effect_use_times==0?"":response.card_effect_use_times;
                        this.isUsed4=response.store_effect_use_times==0?false:true;
                        this.saveForm.store_effect_use_times=response.store_effect_use_times==0?"":response.store_effect_use_times;
                        this.isUsed5=response.store_day_use_times==0?false:true;
                        this.saveForm.store_day_use_times=response.store_day_use_times==0?"":response.store_day_use_times;
                    })
                } else {
                    this.saveForm.name = ''
                    this.saveForm.remark = ''
                    this.saveForm.exchange_voucher = ''
                    this.saveForm.money = ''
                    this.saveForm.type_id = ''
                    this.saveForm.type = ''
                    this.saveForm.card_type_id = []
                    this.saveForm.add_coins = ''
                    this.saveForm.add_ticket = ''
                    this.saveForm.add_score = ''
                    this.saveForm.add_time = ''
                    this.saveForm.product_id = ''
                    this.saveForm.effect_time = ''
                    this.saveForm.stop_time = ''
                    this.saveForm.pickerDate = ''
                    this.saveForm.is_collect = '';
                    this.saveForm.is_re = false;
                    this.saveForm.card_use_type = '0';
                    this.saveForm.use_time="";
                    this.saveForm.card_day_use_times="";
                    this.saveForm.card_effect_use_times="";
                    this.saveForm.store_effect_use_times="";
                    this.saveForm.store_day_use_times="";
                    this.isUsed1=false;
                    this.isUsed2=false;
                    this.isUsed3=false;
                    this.isUsed4=false;
                    this.isUsed5=false;
                    this.$nextTick(()=>{
                        this.$refs.saveForm.clearValidate();
                    })
                }
            },
            delActivityClick(id, index) {
                this.$confirm('确认删除', '提示', { type: 'warning' }).then(() => {
                    delActivity({ id: id }).then(response => {
                        this.$message({
                            type: response.code == 1 ? 'success' : 'error',
                            message: response.message
                        });
                        if (response.code == 1) {
                            this.list.splice(index, 1);
                        }
                    });
                })
            },
            saveClick(formName) {
                this.$refs[formName].validate((valid) => {
                    if (valid) {
                        this.saveForm.effect_time = this.saveForm.pickerDate[0];
                        this.saveForm.stop_time = this.saveForm.pickerDate[1];
                        let data = JSON.parse(JSON.stringify(this.saveForm))
                        data.use_time=data.use_time==""?0:data.use_time;
                        data.card_day_use_times=data.card_day_use_times==""?0:data.card_day_use_times;
                        data.card_effect_use_times=data.card_effect_use_times==""?0:data.card_effect_use_times;
                        data.store_effect_use_times=data.store_effect_use_times==""?0:data.store_effect_use_times;
                        data.store_day_use_times=data.store_day_use_times==""?0:data.store_day_use_times;
                        save(data, this.url).then(response => {
                            this.$message({ type: response.code == 1 ? 'success' : 'error', message: response.message });
                            if (response.code == 1) {
                                this.handleCurrentChange(this.currentPage);
                                this.addEditDialog = false;
                            }
                        });
                    }
                });
            },
            searchClick() {
                this.fetchData()
            },
            getStore() {
                getStoreList({ category_id: 256 }).then(response => {
                    this.storeList = response;
                     let data = response.filter(res => 
                        res.id == this.$store.getters.optionId
                    )
                    if(data.length>0){
                        this.formInline.store_id = data[0].id;
                    } else { 
                        if(this.storeList.length > 0) {
                            this.formInline.store_id = this.storeList[0].id;
                        }
                    }
                    
                    if (this.list == null) {
                        this.fetchData()
                    }
                    this.t_store_list = response.filter(item => item.name !== '全门店');
                });
            },
            //关闭弹框重置
            callOf(formName) {
                this.$refs[formName].resetFields();
            },
            async fetchData() {
                this.listLoading = true;
                this.currentPage = 1;
                 this.list = []
                try {
                    let page = await getPage(this.formInline)
                    if (page.page > 0) {
                        this.totalDataNumber = page.count * 1;
                        this.list = await getList(this.formInline)
                    }else{
                        this.$message({ type: 'error', message: "没有找到相关套餐！"});
                        this.formInline.name="";
                    }
                    this.listLoading = false;                    
                } catch (error) {
                    this.listLoading = false;
                }

            },
            async handleCurrentChange(val) {
                this.listLoading = true;
                this.list = await getList(this.formInline, val)
                this.listLoading = false;
            },
        },
        watch:{
            "saveForm.product_id":function(val){
                this.saveForm.product_id=this.saveForm.product_id.replace(/^\s+|\s+$/g, "")
            }
        }
    };
</script>

<style rel="stylesheet/scss" lang="scss" scoped>
    .check_item{
        position: relative;
        .check_box{
            position: absolute;
            top: 0px;
            left: 350px;
        }
    }
</style>